<template>
  <!-- 电站基础信息 表单 -->
  <div class="form">
    <a-form
      :model="form"
      :rules="rules"
      layout="inline"
      :labelCol="labelCol"
      ref="formRef"
    >
      <a-form-item label="多期项目：" name="isMultiple">
        <a-select
          ref="select"
          v-model:value="form.isMulti"
          class="formSelect"
          placeholder="请选择"
          @change="changeMulti"
        >
          <a-select-option :value="0">否</a-select-option>
          <a-select-option :value="1">是</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item v-if="form.isMulti" label="企业名称：" name="projectId">
        <a-select
          v-if="form.isMulti"
          ref="select"
          show-search
          v-model:value="form.projectId"
          class="formSelect"
          placeholder="请选择"
          :filterOption="filterOption"
          @change="changeCompany"
          allow-clear
        >
          <a-select-option
            v-for="item in companyList"
            :key="item.id"
            :value="item.id"
            :label="item.projectName"
          >
            {{ item.projectName }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item v-else label="企业名称：" name="projectName">
        <a-input
          v-if="!form.isMulti"
          v-model:value="form.projectName"
          class="formInput"
          placeholder="请输入"
          allow-clear
        />
      </a-form-item>
      <a-form-item label="经度：">
        <a-input-number
          v-model:value="form.longitude"
          class="formInput"
          placeholder="请输入"
          :controls="false"
        />
      </a-form-item>
      <a-form-item label="纬度：">
        <a-input-number
          v-model:value="form.latitude"
          class="formInput"
          placeholder="请输入"
          :controls="false"
        />
      </a-form-item>
      <a-form-item label="企业地址：" name="provId" style="width: 461px">
        <div class="areaSelectContent">
          <a-select
            ref="select"
            v-model:value="form.provId"
            class="areaSelect"
            placeholder="省份"
            show-search
            optionFilterProp="label"
            @change="changeProv"
          >
            <a-select-option
              v-for="item in provList"
              :key="item.provId"
              :value="item.provId"
              :label="item.provName"
            >
              {{ item.provName }}
            </a-select-option>
          </a-select>
          <a-form-item-rest>
            <a-select
              ref="select"
              v-model:value="form.cityId"
              class="areaSelect"
              placeholder="城市"
              show-search
              optionFilterProp="label"
              @change="changeCity"
            >
              <a-select-option
                v-for="item in cityList"
                :key="item.cityId"
                :value="item.cityId"
                :label="item.cityName"
              >
                {{ item.cityName }}
              </a-select-option>
            </a-select>
          </a-form-item-rest>
          <a-form-item-rest>
            <a-select
              ref="select"
              v-model:value="form.countyId"
              class="areaSelect"
              placeholder="区"
              optionFilterProp="label"
              show-search
            >
              <a-select-option
                v-for="item in countyList"
                :key="item.countyId"
                :value="item.countyId"
                :label="item.countyName"
              >
                {{ item.countyName }}
              </a-select-option>
            </a-select>
          </a-form-item-rest>
        </div>
      </a-form-item>
      <a-form-item label="详细地址：" name="address">
        <a-textarea
          v-model:value="form.address"
          class="formInput"
          placeholder="请输入"
          :rows="1"
        />
      </a-form-item>
      <a-form-item label="电站名称：" name="stationName">
        <a-input
          v-model:value="form.stationName"
          class="formInput"
          placeholder="请输入"
        />
      </a-form-item>
      <a-form-item label="电站名称缩写：" name="stationShortName">
        <a-input
          v-model:value="form.stationShortName"
          class="formInput"
          maxlength="4"
          placeholder="请输入四字以内缩写"
        />
      </a-form-item>
      <a-form-item label="电站容量(MWh)：" name="capacity">
        <a-input-number
          v-model:value="form.capacity"
          class="formInput"
          placeholder="请输入"
          :controls="false"
        />
      </a-form-item>
      <!-- <a-form-item label="所属厂商：" name="supplierId">
        <a-select
          v-model:value="form.supplierId"
          class="formInput"
          placeholder="请选择"
          @change="changeSupplierType"
          allow-clear
          :loading="formLoading"
        >
          <a-select-option
            v-for="item in supplierList"
            :value="item.supplierId"
            :key="item.supplierId"
          >
            {{ item.supplierShortName }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="所属型号：" name="typeId">
        <a-select
          v-model:value="form.typeId"
          class="formInput"
          placeholder="请选择"
          :disabled="!form.supplierId"
          allow-clear
          :loading="formLoading"
        >
          <a-select-option
            v-for="item in supplierTypeList"
            :value="item.id"
            :key="item.id"
          >
            {{ item.type }}
          </a-select-option>
        </a-select>
      </a-form-item> -->
      <a-form-item label="设备型号：" name="equipModelId">
        <a-select
          ref="select"
          v-model:value="form.equipModelId"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in equipModelList"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          >
            {{ item.label }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="是否高压项目：" name="isHighVoltage">
        <a-select
          ref="select"
          v-model:value="form.isHighVoltage"
          class="formSelect"
          placeholder="请选择"
        >
          <a-select-option :value="0">否</a-select-option>
          <a-select-option :value="1">是</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="计费方式：" name="billingMethod">
        <a-select
          ref="select"
          v-model:value="form.billingMethod"
          class="formSelect"
          placeholder="请选择"
        >
          <a-select-option :value="1">容量计费</a-select-option>
          <a-select-option :value="2">需量计费</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item
        label="电站需量(kw)："
        :name="form.billingMethod === 2 ? 'stationDemand' : ''"
      >
        <a-input-number
          v-model:value="form.stationDemand"
          class="formInput"
          placeholder="请输入"
          :controls="false"
        />
      </a-form-item>
      <a-form-item label="投运日期：" name="operationDate">
        <a-date-picker
          v-model:value="form.operationDate"
          placeholder="选择日期"
          class="formSelect"
          formatter="YYYY-MM-DD"
          value-format="YYYY-MM-DD"
        />
      </a-form-item>
      <a-form-item label="DOD：" name="dod">
        <a-select
          ref="select"
          v-model:value="form.dod"
          class="formSelect"
          placeholder="请选择"
        >
          <a-select-option :value="0">95%</a-select-option>
          <a-select-option :value="2">99%</a-select-option>
          <a-select-option :value="1">100%</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="液冷/风冷项目">
        <a-select
          ref="select"
          v-model:value="form.projectType"
          class="formSelect"
          placeholder="请选择"
        >
          <a-select-option :value="0">液冷</a-select-option>
          <a-select-option :value="1">风冷</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="电站初始容量(MWh)：" name="initialCapacity">
        <a-input-number
          v-model:value="form.initialCapacity"
          class="formInput"
          placeholder="请输入"
          :controls="false"
        />
      </a-form-item>
      <a-form-item label="运行负责人：" name="runUserId">
        <a-select
          ref="select"
          v-model:value="form.runUserId"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in userList"
            :key="item.id"
            :value="item.id"
            :label="item.username"
          >
            {{ item.username }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="投资方：" name="investor">
        <a-select
          ref="select"
          v-model:value="form.investor"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in INVESTORS_LIST"
            :key="item.value"
            :value="item.value"
          >
            {{ item.label }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="是否代运营" name="isAgencyOperator">
        <a-select
          v-model:value="form.isAgencyOperator"
          class="formInput"
          placeholder="请选择"
        >
          <a-select-option :value="1">是</a-select-option>
          <a-select-option :value="0">否</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="储充项目" name="isChargeProject">
        <a-select
          v-model:value="form.isChargeProject"
          class="formInput"
          placeholder="请选择"
        >
          <a-select-option :value="1">是</a-select-option>
          <a-select-option :value="0">否</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="集装箱项目" name="isContainer">
        <a-select
          v-model:value="form.isContainer"
          class="formInput"
          placeholder="请选择"
        >
          <a-select-option :value="1">是</a-select-option>
          <a-select-option :value="0">否</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="电站状态" name="es">
        <a-select
          v-model:value="form.es"
          class="formInput"
          placeholder="请选择"
        >
          <a-select-option :value="1">待建设</a-select-option>
          <a-select-option :value="2">建设中</a-select-option>
          <a-select-option :value="3">运行中</a-select-option>
          <a-select-option :value="4">停运</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="旧系统电站关联" name="">
        <a-select
          ref="select"
          v-model:value="form.oldSysStationIds"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
          mode="multiple"
        >
          <a-select-option
            v-for="item in oldStationList"
            :key="item.id"
            :value="item.id"
            :label="item.name"
          >
            {{ item.name }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="电芯厂家" name="manufacturerBattery">
        <a-select
          ref="select"
          v-model:value="form.manufacturerBattery"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in batteryList"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          >
            {{ item.label }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="PCS厂家" name="manufacturerPcs">
        <a-select
          ref="select"
          v-model:value="form.manufacturerPcs"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in pcsList"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          >
            {{ item.label }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="BMS厂家" name="manufacturerBms">
        <a-select
          ref="select"
          v-model:value="form.manufacturerBms"
          class="formInput"
          placeholder="请输入搜索"
          show-search
          optionFilterProp="label"
        >
          <a-select-option
            v-for="item in bmsList"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          >
            {{ item.label }}
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="浙江平台数据上报" name="zjdataReportSwitch">
        <a-select
          v-model:value="form.zjdataReportSwitch"
          class="formInput"
          placeholder="请选择"
          @change="changeZJdataReportSwitch"
        >
          <a-select-option :value="1">是</a-select-option>
          <a-select-option :value="0">否</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item
        label="浙江平台项目编码："
        name="zjdataProjectNo"
        :required="form.zjdataReportSwitch === 1"
      >
        <a-input
          v-model:value="form.zjdataProjectNo"
          class="formInput"
          placeholder="请从浙江省电化学储能管理平台处复制，不可填错"
          allow-clear
        />
      </a-form-item>
      <!-- 占位，之后可删 -->
      <div style="width: 100%"></div>

      <a-form-item label="一次接线图：" name="wiringDiagramUrl">
        <a-upload
          v-model:file-list="fileList"
          name="file"
          list-type="picture-card"
          class="addStationUpload"
          accept=".JPEG,.JPG,.TIFF,.RAW,.BMP,.GIF,.PNG,.PDF"
          :max-count="1"
          :action="handleImport"
          :headers="headers"
          method="post"
          :preview-file="previewFile"
          :before-upload="beforeUpload"
          @change="(e) => handleUploadChange(e, 1)"
          @remove="(e) => handleRemove(e, 1)"
        >
          <!-- <img v-if="imageUrl" :src="imageUrl" alt="avatar" /> -->
          <div>
            <loading-outlined v-if="loading"></loading-outlined>
            <plus-outlined v-else></plus-outlined>
            <div class="ant-upload-text">上传</div>
          </div>
        </a-upload>
        <div class="uploadTip">
          支持JPEG、TIFF、RAW、BMP、GIF、PNG、PDF等格式，上传数量不得超过一个，大小不得超过10M
        </div>
      </a-form-item>
      <a-form-item label="组网图" name="networkDiagramUrl">
        <a-upload
          v-model:file-list="networkFileList"
          name="file"
          list-type="picture-card"
          class="addStationUpload"
          accept=".JPEG,.JPG,.TIFF,.RAW,.BMP,.GIF,.PNG,.PDF"
          :max-count="1"
          :action="handleImport"
          :headers="headers"
          method="post"
          :preview-file="previewFile"
          :before-upload="beforeUpload"
          @change="(e) => handleUploadChange(e, 2)"
          @remove="(e) => handleRemove(e, 2)"
        >
          <!-- <img v-if="imageUrl" :src="imageUrl" alt="avatar" /> -->
          <div>
            <loading-outlined v-if="loading"></loading-outlined>
            <plus-outlined v-else></plus-outlined>
            <div class="ant-upload-text">上传</div>
          </div>
        </a-upload>
        <div class="uploadTip">
          支持JPEG、TIFF、RAW、BMP、GIF、PNG、PDF等格式，上传数量不得超过一个，大小不得超过10M
        </div>
      </a-form-item>
    </a-form>
  </div>
</template>
<script setup>

import storage from "@/utils/storage"
import { debounce } from "lodash-es"
import { INVESTORS_LIST } from "@/constants/stationConfig"

const labelCol = { style: { width: "160px" } }
const $api = inject("$api")
const formLoading = ref(false)
const provList = ref([])
const cityList = ref([])
const countyList = ref([])
const props = defineProps({
  rowData: {
    type: Object,
  },
  isEdit: {
    type: Boolean,
    default: false,
  },
})
const userInf = storage.getItem("USER_INFO")
const headers = ref({
  Authorization: "Bearer " + userInf.access_token,
})
const emits = defineEmits(["update:validateFormPass"])
const formRef = ref(null)
const fileData = ref(null)
const fileList = ref([])
const networkFileList = ref([])
const form = ref({
  isMulti: 0,
  projectName: null,
  projectId: null,
  address: null,
  stationName: null,
  stationShortName: null,
  capacity: null,
  // typeId: null,
  // supplierId: null,
  equipModelId: null,
  isHighVoltage: null,
  billingMethod: null,
  stationDemand: null,
  operationDate: null,
  provId: null,
  cityId: null,
  countyId: null,
  wiringDiagramUrl: null,
  networkDiagramUrl: null,
  dod: null,
  projectType: null,
  initialCapacity: null,
  runUserId: null,
  investor: null,
  isAgencyOperator: 0,
  isChargeProject: 0,
  isContainer: 0,
  wiringDiagramFileId: null,
  networkDiagramFileId: null,
  es: 1,
  manufacturerBattery: null,
  manufacturerPcs: null,
  manufacturerBms: null,
  zjdataReportSwitch: null,
  zjdataProjectNo: null,
})
const rules = ref({
  projectName: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  projectId: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  provId: {
    required: true,
    message: "请选择地址",
    trigger: "change",
  },
  runUserId: [
    {
      required: true,
      message: "请选择",
      trigger: "blur",
    },
  ],
  stationName: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  stationShortName: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  capacity: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  // supplierId: [
  //   {
  //     required: true,
  //     message: "请选择",
  //     trigger: "change",
  //   },
  // ],
  // typeId: [
  //   {
  //     required: true,
  //     message: "请选择",
  //     trigger: "change",
  //   },
  // ],
  equipModelId: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  isHighVoltage: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  billingMethod: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  operationDate: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  wiringDiagramUrl: [
    {
      required: true,
      message: "请上传",
      trigger: "change",
    },
  ],
  networkDiagramUrl: [
    {
      required: true,
      message: "请上传",
      trigger: "change",
    },
  ],
  stationDemand: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  dod: [
    {
      required: true,
      message: "请选择",
      trigger: "blur",
    },
  ],
  initialCapacity: [
    {
      required: true,
      message: "请输入",
      trigger: "blur",
    },
  ],
  investor: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  isAgencyOperator: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  isChargeProject: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  isContainer: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  es: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  manufacturerBattery: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  manufacturerPcs: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  manufacturerBms: [
    {
      required: true,
      message: "请选择",
      trigger: "change",
    },
  ],
  zjdataProjectNo: [
    {
      validator: (rule, value) => {
        // 当浙江平台数据上报设置为"是"(值为1)时，项目编码为必填
        if (form.value.zjdataReportSwitch === 1) {
          if (!value || value.trim() === "") {
            return Promise.reject("请输入浙江平台项目编码")
          }
        }
        return Promise.resolve()
      },
      trigger: "blur",
    },
  ],
})
const beforeUpload = (file) => {
  if (file.size > 10 * 1024 * 1024) {
    // 超过限制大小
    message.warning(`上传文件不能超过10MB`, 4)
    return false
  }
}
const validateForm = () => {
  formRef.value
    .validate()
    .then(() => {
      emits("validateFormPass", form.value)
    })
    .catch((error) => {
      console.log("error", error)
    })
  // emits("validateFormPass", form.value);
}
const cancel = () => {
  supplierTypeList.value = []
  provList.value = []
  cityList.value = []
  countyList.value = []
  fileList.value = []
  networkFileList.value = []

  form.value = {
    isMulti: 0,
    projectName: null,
    projectId: null,
    address: null,
    stationName: null,
    stationShortName: null,
    capacity: null,
    // supplierId: null,
    // typeId: null,
    equipModelId: null,
    isHighVoltage: null,
    billingMethod: null,
    stationDemand: null,
    operationDate: null,
    provId: null,
    cityId: null,
    countyId: null,
    wiringDiagramUrl: null,
    networkDiagramUrl: null,
    dod: null,
    projectType: null,
    initialCapacity: null,
    runUserId: null,
    investor: null,
    isAgencyOperator: 0,
    isChargeProject: 0,
    isContainer: 0,
    wiringDiagramFileId: null,
    networkDiagramFileId: null,
    es: 1,
    manufacturerBattery: null,
    manufacturerPcs: null,
    manufacturerBms: null,
    zjdataReportSwitch: null,
    zjdataProjectNo: null,
  }
  formRef.value.clearValidate()
}
const oldStationList = ref([])
const getOldStationList = async () => {
  const res = await $api.getOldSysStationList()
  oldStationList.value = res.data
}
const companyList = ref([])
const getCompanyList = async () => {
  const res = await $api.companyList()
  companyList.value = res.data
}
const filterOption = (input, option) => {
  return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
const changeCompany = async (value) => {
  // 因为企业名称都是用 projectName 入参，所以需要找到对应的 id 去做搜索
  // const prefixId = companyList.value.find(
  //   (item) => item.projectName === value
  // ).id;
  const res = await $api.companyDetails({
    id: value,
  })
  form.value.id = value
  if (res && res.code === 0) {
    // 下拉选择了企业，则自动带出 经纬度、项目地址、详细地址
    const resData = res.data[0]
    form.value.longitude = resData?.longitude
    form.value.latitude = resData?.latitude
    form.value.provId = resData?.provId
    form.value.cityId = resData?.cityId
    form.value.countyId = resData?.countyId
    form.value.address = resData?.address
  }
}
const changeMulti = () => {
  form.value.projectName = null
  form.value.longitude = null
  form.value.latitude = null
  form.value.provId = null
  form.value.cityId = null
  form.value.countyId = null
  form.value.address = null
  supplierTypeList.value = []
}
const handleSupplierTypeList = (id) => {
  supplierTypeList.value =
    supplierList.value.filter((item) => item.supplierId === id)[0]
      ?.supplierTypeEntities || []
}
const changeSupplierType = (id) => {
  form.value.equipModelId = null
  handleSupplierTypeList(id)
}
const supplierList = ref([])
const supplierTypeList = ref([])
const getSupplierTypeTree = async () => {
  const res = await $api.supplierTypeTree()
  supplierList.value = res.data
}
const getBaseProvinceTree = async () => {
  const res = await $api.baseProvinceTree()
  provList.value = res.data
}
const changeProv = async (id) => {
  form.value.cityId = null
  form.value.countyId = null
  cityList.value = []
  countyList.value = []
  const res = await $api.baseCityTree(id)
  cityList.value = res?.data
}
const changeCity = async (id) => {
  form.value.countyId = null
  countyList.value = []
  const res = await $api.baseCountyTree(id)
  countyList.value = res?.data
}
const handleImport = async (val) => {
  return `${$api.uploadAction().url}`
}
const handleUploadChange = (fileReponse, type) => {
  switch (type) {
    case 1:
      if (fileReponse.file?.response?.code === 0) {
        fileData.value = fileReponse.file.response.data
        form.value.wiringDiagramUrl = fileReponse.file.response.data.url
        form.value.wiringDiagramFileId = fileReponse.file.response.data.id
      }
      break
    case 2:
      if (fileReponse.file?.response?.code === 0) {
        fileData.value = fileReponse.file.response.data
        form.value.networkDiagramUrl = fileReponse.file.response.data.url
        form.value.networkDiagramFileId = fileReponse.file.response.data.id
      }
      break
  }
}
const handleRemove = (file, type) => {
  switch (type) {
    case 1:
      form.value.wiringDiagramUrl = null
      form.value.wiringDiagramFileId = null
      formRef.value.validateFields(["wiringDiagramUrl"])
      break
    case 2:
      form.value.networkDiagramUrl = null
      form.value.networkDiagramFileId = null
      formRef.value.validateFields(["networkDiagramUrl"])
      networkFileList.value = []
      break
  }
}
const changeZJdataReportSwitch = (val) => {
  if (val === 1) {
    Modal.warning({
      title: "温馨提示",
      content: "该电站有数据的前提下，20分钟后数据开始上报!",
    })
    // message.warning("该电站有数据的前提下，20分钟后数据开始上报!")
  }
}
onMounted(async () => {
  formLoading.value = true
  getOldStationList()
  await getCompanyList()
  await getSupplierTypeTree()
  await getBaseProvinceTree()
  await getManufacturerEnum()
  await searchUser()
  formLoading.value = false
  if (props.isEdit) {
    changeProv(props.rowData.provId)
    changeCity(props.rowData.cityId)
    form.value = {
      ...props.rowData,
    }
    form.value.projectId = props.rowData.id
    form.value.oldSysStationIds = props.rowData?.oldSysStationIdList
    fileList.value = [
      {
        url: props.rowData.wiringDiagramUrl,
      },
    ]
    networkFileList.value = props.rowData.hasOwnProperty("networkDiagramUrl")
      ? [
          {
            url: props.rowData.networkDiagramUrl,
          },
        ]
      : []
  }
})
const userList = ref([])
const searchUser = async (value) => {
  const res = await $api.userListData({
    username: value,
  })
  if (res.code === 0) {
    userList.value = res.data
  }
}
const equipModelList = ref([])
const batteryList = ref([])
const pcsList = ref([])
const bmsList = ref([])
const getManufacturerEnum = async () => {
  const res = await $api.getManufacturerEnum()
  if (res.code === 0) {
    batteryList.value = Object.entries(res.data.battery).map(
      ([key, value]) => ({
        value: Number(key),
        label: value,
      })
    )
    pcsList.value = Object.entries(res.data.pcs).map(([key, value]) => ({
      value: Number(key),
      label: value,
    }))
    bmsList.value = Object.entries(res.data.bms).map(([key, value]) => ({
      value: Number(key),
      label: value,
    }))
    equipModelList.value = Object.entries(res.data.equipModel).map(
      ([key, value]) => ({
        value: Number(key),
        label: value,
      })
    )
  }
}
const debounceSearchUser = debounce(searchUser, 300)
const filterUserOption = (input, option) => {
  return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
defineExpose({ validateForm, cancel })
</script>

<style lang="less" scoped>
.form {
  padding: 0 40px;
  margin-top: 30px;
}
.formInput,
.formSelect {
  width: 300px;
}
.ant-form-item {
  margin-bottom: 30px;
}
.areaSelectContent {
  display: inline-block;
}
.areaSelect {
  display: inline-block;
  width: 97px;
  margin-right: 5px;
  &:last-child {
    margin-right: 0;
  }
}
.formTextarea {
  width: 777px;
}
.uploadTip {
  font-size: 12px;
  color: #999;
}
</style>
<style lang="less">
.addStationUpload {
  .anticon-eye {
    display: none;
  }
}
</style>
